import {Map, View} from "@tarojs/components";
import {Swiper, Video} from '@nutui/nutui-react-taro'
import {useDidShow} from "@tarojs/taro";
import {tabBarStore} from "@/store/tabbar-store";

function Videos() {
	useDidShow(() => {
		// 页面显示时更新TabBar状态
		tabBarStore.setSelected(1)
	})


	const localVideo = 'https://storage.360buyimg.com/nutui/video/video_NutUI.mp4';
	console.log("localVideo", localVideo)

	const error = () => {
	}

	const options = {
		controls: true,
	}
	const play = (elm: any) => console.log('play', elm)
	const pause = (elm: any) => console.log('pause', elm)
	const playend = (elm: any) => console.log('playend', elm)
	const list = [
		{
			src: localVideo,
			type: 'video/mp4',
		},
		{
			src: 'https://storage.360buyimg.com/nutui/video/video_NutUI.mp4',
			type: 'video/mp4',
		},
		{
			src: 'https://storage.360buyimg.com/nutui/video/video_NutUI.mp4',
			type: 'video/mp4',
		},
		{
			src: 'https://storage.360buyimg.com/nutui/video/video_NutUI.mp4',
			type: 'video/mp4',
		}
	]

	return (
		<View className='index'>

			<Swiper defaultValue={0} direction='vertical'>
				{list.map((item) => (
					<Swiper.Item key={item.src}>
						<Video source={item} options={options} onPlay={play} onPause={pause} onPlayEnd={playend} />
					</Swiper.Item>
				))}
			</Swiper>
			video
			<Map longitude={113.324520} latitude={23.099994} onError={error}></Map>
		</View>
	)
}

export default Videos;
